<template>
  <div class="foot">
    <span>合计：{{ List.length }}</span>
    <span @click="clear" class="clear">清空任务</span>
  </div>
</template>

<script>
export default {
  name: 'FootArea',
  props:{
    List:{
      type:Array
    }
  },
  methods: {
    clear(){
      this.$emit("clear")
    }
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .foot{
    color:rgb(111, 111, 111);
    width: 100%;
    display: flex;
    justify-content:space-between;
    padding: 0px 15px;
    box-sizing: border-box;
    user-select: none;
  }
  .clear{
    cursor: pointer;
  }
</style>
